<template>
	<van-tabs v-model="tabs.index" color="#00CC00" class="order-list-items">
		<van-tab title="待收取">
			<van-list v-model="collect.loading" :finished="collect.finished" finished-text="没有更多了" @load="onLoad(collect.textType)">
				<normal-order-list v-for="(item, index) in collect.dataset" :key="index" :ibase="item.base" :dataset="item.items" :textType="collect.textType" class="el-item" />
			</van-list>
		</van-tab>
		<van-tab title="待确认">
			<van-list v-model="confirm.loading" :finished="confirm.finished" finished-text="没有更多了" @load="onLoad(confirm.textType)">
				<normal-order-list v-for="(item, index) in confirm.dataset" :key="index" :ibase="item.base" :dataset="item.items" :textType="confirm.textType" class="el-item" />
			</van-list>
		</van-tab>
		<van-tab title="已完成">
			<van-list v-model="complete.loading" :finished="complete.finished" finished-text="没有更多了" @load="onLoad(complete.textType)">
				<normal-order-list v-for="(item, index) in complete.dataset" :key="index" :ibase="item.base" :dataset="item.items" :textType="complete.textType" class="el-item" />
			</van-list>
		</van-tab>
		<van-tab title="已取消">
			<van-list v-model="cancel.loading" :finished="cancel.finished" finished-text="没有更多了" @load="onLoad(cancel.textType)">
				<normal-order-list v-for="(item, index) in cancel.dataset" :key="index" :ibase="item.base" :dataset="item.items" :textType="cancel.textType" class="el-item" />
			</van-list>
		</van-tab>
	</van-tabs>
</template>

<script>
	import { Tab, Tabs, List } from 'vant';

	import NormalOrderList from '../../components/currency/order-item/normal-list-shop.vue';

	export default {
		name: 'ShopOrderListing',
		components: {
			[Tab.name]: Tab, [Tabs.name]: Tabs, [List.name]: List,
			NormalOrderList
		},
		data() {
			return {
				tabs: {
					index: 0
				},
				collect: {
					loading: false,
					finished: false,
					textType: 'collect',
					page: 0,
					list_rows: 10,
					dataset: []
				},
				confirm: {
					page: 0,
					list_rows: 10,
					loading: false,
					finished: false,
					textType: 'confirm',
					dataset: []
				},
				complete: {
					page: 0,
					list_rows: 10,
					loading: false,
					finished: false,
					textType: 'complete',
					dataset: []
				},
				cancel: {
					page: 0,
					list_rows: 10,
					loading: false,
					finished: false,
					textType: 'cancel',
					dataset: []
				}
			}
		},
		mounted() {
			this.tabs.index = this.$route.query.index;
		},
		methods: {
			getOrderList(items) {
				var that = this;
				var status = '';
				switch (items.textType) {
					case 'collect':
						status = 1;
						break;
					case 'confirm':
						status = 4;
						break;
					case 'complete':
						status = 5;
						break;
					case 'cancel':
						status = 6;
						break;
				}
				var url = '/api/home/order/getlist';
				var param = {
					page: items.page,
					list_rows: items.list_rows,
					status: status,
					groupid: 1,
					token: that.$store.state.options.user.token
				};
				var detail = [];
				this.$util.postRequestInterface(url, param, (res) => {
					items.page = items.page + 1;
					if (res.data == '') {
						items.loading = false;
						items.finished = true;
					} else {
						for (let i of res.data.data) {
							for (let x of i.detail) {
								detail.push({
									title: x.garbagename,
									// number: x.weighting_method == 1 ? x.weighting_num : '',
									// weight: x.weighting_method == 0 ? x.weighting_num : '',
                                    number: x.weighting_num,
                                    unit: x.danweiming,
									time: that.$moment(i.create_time * 1000).format('YYYY-MM-DD HH:mm:ss'),
								})
							}
							items.dataset.push({
								base: {
									number: i.ordernumber,
									amount: i.price,
									protect: i.isbaozhi,
									price: i.price
								},
								items: detail
							});
							detail = []
						}
						// // 加载状态结束
						items.loading = false;
						// // 数据全部加载完成
						if (items.dataset.length >= res.data.count) {
							items.finished = true;
						}
					}
				})
			},
			onLoad(textType) {
				switch (textType) {
					case 'collect':
						this.getOrderList(this.collect);
						break;
					case 'confirm':
						this.getOrderList(this.confirm);
						break;
					case 'complete':
						this.getOrderList(this.complete);
						break;
					case 'cancel':
						this.getOrderList(this.cancel);
						break;
				}
			}
		}
	}
</script>

<style lang='scss' scoped>
	.order-list-items {

		.el-item {
            padding: 0.5rem 1rem 0rem;
		}
	}
</style>
